<template>
  <div>
    <div class="header_title">游戏推广地址</div>
    <div :class="appName === '277'? 'game_introduce' : 'game_introduce_cat'" @click="$router.back()">查看游戏详情</div>
    <div class="line"></div>
    <div class="content_box">
      <promotion-tab-control @change-index="changeIndex" :appName="appName"/>
      <platform-apk :info="info" v-if="currentIndex === 0" :appName="appName"/>
      <platform-ios :info="info" v-else :appName="appName"/>
    </div>
    <!-- <div class="header_title">游戏推广地址</div> -->
    <div class="line"></div>
    <div class="content_box_down">
      <div class="title_item title_item_bottom">{{appName}}APP推广地址</div>
      <extension-share/>
    </div>
  </div>
</template>

<script>
import PromotionTabControl from './PromotionTabControl.vue'

import ExtensionShare from '../../extension/childComps/ExtensionShare.vue'
import PlatformApk from './PlatformApk.vue'
import PlatformIos from './PlatformIos.vue'
import { appName } from '../../../assets/js/app'
  export default {
  components: { PromotionTabControl, ExtensionShare, PlatformApk, PlatformIos },
    data() {
      return {
        info: {},
        currentIndex: 0,
        appName: null,
      }
    },
    created () {
      this.appName = appName()
      if(this.$route.query.info) {
        this.info = this.$route.query.info
      };
    },
    
    methods: {
      gameIntroduce() {
        this.$router.push('/game_introduce')
      },
      changeIndex(val) {
        this.currentIndex = val
        // this.getQrcode()
      },
      
      
    },
    // computed: {
    //   url() {
    //     return this.currentIndex === 0 ? this.info.apk_url : this.info.ios_url
    //   }
    // },
  }
</script>

<style scoped>
.header_title {
  font-size: 34px;
  width: 750px;
  height: 88px;
  background: #fff;
  text-align: center;
  line-height: 88px;
  color: #333333;
  font-weight: bold;
}

.game_introduce {
  font-size: 30px;
  color: #fff;
  margin: 20px auto 40px;
  width: 400px;
  height: 70px;
  border-radius: 35px;
  background: #2F41EB;
  font-weight: bold;
  text-align: center;
  line-height: 70px;
}

.game_introduce_cat {
  font-size: 30px;
  color: #fff;
  margin: 20px auto 40px;
  width: 400px;
  height: 70px;
  border-radius: 35px;
  background: linear-gradient(314deg,#ff5e39 10%, #ff8210 87%);
  font-weight: bold;
  text-align: center;
  line-height: 70px;
}

.line {
  width: 100%;
  height: 10px;
  background: #EFEFEF;
}

.line_bottom {
  margin-top: 50px;
}

.content_box {
  padding: 0 35px;
}

.content_box_down {
  padding: 0 35px 30px;
  background: #fff;
}

.title_item {
  font-size: 26px;
  color: #999;
  line-height: 100px;
  border-bottom: 1px solid rgb(206, 206, 206);
}

.title_item_bottom {
  font-size: 30px;
  font-weight: bold;
  color: #333;
  line-height: 120px;

}


</style>